<template>
  <div>
    <el-container>
      <el-header>
        <div>
          <el-row class="row-bg" justify="space-evenly">
            <el-col :span="6"
              ><img src="@/assets/images/zcst/logo.png" class="logo-img"
            /></el-col>
            <el-col :span="6" class="my-center-grid"
              ><my-search :width="400"></my-search
            ></el-col>
            <el-col :span="6" class="my-center-grid">
              <div>
                <template v-for="(item, index) in result.topLinks" :key="index">
                  <el-link>
                    <a :href="item.url" target="_blank">
                      {{ item.content }}
                    </a></el-link
                  >
                  <template v-if="index < result.topLinks.length - 1"
                    >&nbsp;&nbsp;|&nbsp;&nbsp;</template
                  >
                </template>
              </div></el-col
            >
          </el-row>
        </div>
      </el-header>
      <el-main>
        <div>
          <my-carousel
            :imgList="result.carouselImages ? result.carouselImages : undefined"
          ></my-carousel></div
      ></el-main>
      <el-footer></el-footer>
    </el-container>
  </div>
</template>

<script setup>
import httpIndexApi from '@/api/httpIndexApi'
const result = ref({})
onMounted(async () => {
  await httpIndexApi(result.value)
})
</script>

<style scoped>
.logo-img {
  width: 100%;
}
</style>
@/api/indexInit@/api/httpIndexApi
